<html>
	<head>
		<title>Resizing Columns Test</title>
	</head>
		<style type="text/css">
			body
			{
				margin: 0;
				padding: 0;
			}

			.columnGrabber
			{
				position: fixed;
				position: expression("absolute");
				top: 0;
				top: expression(eval(document.body.scrollTop));
				width: 8px;
				height: 100%;
				margin-left: -4px;
				cursor: col-resize;
				
				background-color: #000000;
			}
			div
			{
				overflow: hidden;
				white-space: nowrap;
			}
			td
			{
				padding-left: 4px;
				padding-right: 5px;
			}
		</style>

		<script type="text/javascript" src="scripts/sizableColumns.js"></script>
		<script type="text/javascript">
			function load(){
				start('stuff');//Initialize  resizable columns
				var table = document.getElementById("stuff");
				var tableDnD = new TableDnD();
				tableDnD.init(table);
			}
		</script>
	<body  onLoad="load();">
		<table style="margin-left:150px" id="stuff">
			<tr><td>&nbsp;</td><td><div id="cell_0_0" style="width:50px;">This is a really long cell that goes on and on and on</div></td>
			<td><div id="cell_0_1" style="width:50px;">Cell1</div></td>
			<td><div id="cell_0_2" style="width:50px;">Cell2</div></td></tr>
			
			<tr><td>&nbsp;</td><td><div id="cell_1_0" style="width:50px;">Second Row This is a really long cell that goes on and on and on</div></td>
			<td><div id="cell_1_1" style="width:50px;">Cell1</div></td>
			<td><div id="cell_1_2" style="width:50px;">Cell2</div></td></tr>
		</table>
	</body>
</html>